<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>兰顿学院云课堂 -首页</title>
    <!--[if lt IE 9]>
    <script src="./js/html5.js"></script>
    <script src="./js/respond.min.js"></script>
    <![endif]-->
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/font-awesome.min.css">
    <link rel="stylesheet" href="css/idangerous.swiper.css">
</head>
<body>
<header>
    <div class="header-top">
        <div class="logo">
            <img src="http://183.6.175.42:5959/assets/images/LOGO.jpg" alt="">
        </div>
        <div class="nav-bar">
            <!--主菜单-->
            <ul class="nav-bar-menu">
                <li class="li-all-course">
                    <a href="#">全部课程类别<i class="fa fa-chevron-down fa-fw"></i></a>
                    <!--二级菜单-->
                    <ul class="all-menu-course">
                        <li>
                            <a href="#">资质认证</a>
                            <!--三级菜单-->
                            <ul class="menu-course-sub">
                                <li><a href="#">国际认证</a></li>
                                <li><a href="#">国内认证</a></li>
                                <li><a href="#">蓝盾认证</a></li>
                            </ul>
                        </li>
                        <li>
                            <a href="#">信息安全</a>
                            <ul class="menu-course-sub">
                                <li><a href="#">ANQ</a></li>
                                <li><a href="#">ABC</a></li>
                                <li><a href="#">ANQ</a></li>
                            </ul>
                        </li>
                        <li>
                            <a href="#">就业特色培训</a>
                            <ul class="menu-course-sub">
                                <li><a href="#">TES</a></li>
                                <li><a href="#">TES</a></li>
                                <li><a href="#">TES</a></li>
                                <li><a href="#">TES</a></li>
                            </ul>
                        </li>
                        <li><a href="#">职业技能鉴定</a></li>
                        <li><a href="#">C#技术</a></li>
                    </ul>

                </li>
                <li><a href="#">首页</a></li>
                <li><a href="#">信息安全</a></li>
                <li><a href="#">资质认证</a></li>
                <li><a href="#">实训平台</a></li>
                <li><a href="#">论坛</a></li>
            </ul>
        </div>
        <div class="search">
            <input type="text" placeholder="搜索课程">
            <span>注册</span>
            <span>登录</span>
        </div>
    </div>
</header>
<div class="container-course">
    <!--ad-->
    <div class="div-slide-ad">
        <div class="swiper-container">
            <div class="swiper-wrapper">
                <div class="swiper-slide ">
                    <img src="./img/4D6503_20151225180858_2671.png" alt="">
                </div>
                <div class="swiper-slide ">
                    <img src="./img/banner6_20151224163756_0850.png" alt="">
                </div>
                <div class="swiper-slide ">
                    <img src="./img/E16606_20151225180829_1390.png" alt="">
                </div>
            </div>
            <div class="pagination"></div>
        </div>
    </div>
</div>

<section class="course-section">
    <h1><span>云课堂</span></h1>
    <section class="course-list-course">
        <nav class="course-list-course-nav">
            <ul>
                <li><a href="javascript:void(0)" class="course-tab warp_show" data-key="warp1">热门课程</a></li>
                <li><a href="javascript:void(0)" class="course-tab" data-key="warp2">免费课程</a></li>
                <li><a href="javascript:void(0)" class="course-tab" data-key="warp3">推荐课程</a></li>
            </ul>
        </nav>
        <!--warp1-->
        <div class="warp warp1">
            <div class="div-courses">
                <a href="javascript:void(0)">
                    <img src="./img/kctp2.jpg" alt="">
                    <div class="cont">
                        <span class="title">这是第一页</span>
                        <span class="clicks">点击量:660</span>
                    </div>
                </a>
            </div>
            <div class="div-courses">
                <a href="javascript:void(0)">
                    <img src=http://192.168.1.33/files/default/2015/06-12/172635bdc41d559384.jpg?6.6.2 alt="">
                    <div class="cont">
                        <span class="title">啦啦啦</span>
                        <span class="clicks">点击量:123</span>
                    </div>
                </a>
            </div>
            <div class="div-courses">
                <a href="javascript:void(0)">
                    <img src=./img/175726681578291143.jpg?6.6.2 alt="">
                    <div class="cont">
                        <span class="title">应用学密码</span>
                        <span class="clicks">点击量:660</span>
                    </div>
                </a>
            </div>
            <div class="div-courses">
                <a href="javascript:void(0)">
                    <img src="http://192.168.1.33/files/default/2015/06-12/172500cebfdf004785.jpg?6.6.2" alt="">
                    <div class="cont">
                        <span class="title">应用学密码</span>
                        <span class="clicks">点击量:660</span>
                    </div>
                </a>
            </div>
            <div class="div-courses">
                <a href="javascript:void(0)">
                    <img src="./img/17563975289c130676.jpg?6.6.2" alt="">
                    <div class="cont">
                        <span class="title">应用学密码</span>
                        <span class="clicks">点击量:660</span>
                    </div>
                </a>
            </div>
            <div class="div-courses">
                <a href="javascript:void(0)">
                    <img src="./img/1758295ce694730211.jpg?6.6.2" alt="">
                    <div class="cont">
                        <span class="title">应用学密码</span>
                        <span class="clicks">点击量:660</span>
                    </div>
                </a>
            </div>
        </div>

        <!--warp2-->
        <div class="warp warp2">
            <div class="div-courses">
                <a href="javascript:void(0)">
                    <img src="./img/kctp2.jpg" alt="">
                    <div class="cont">
                        <span class="title">这是第二页</span>
                        <span class="clicks">点击量:660</span>
                    </div>
                </a>
            </div>
            <div class="div-courses">
                <a href="javascript:void(0)">
                    <img src=http://192.168.1.33/files/default/2015/06-12/172635bdc41d559384.jpg?6.6.2 alt="">
                    <div class="cont">
                        <span class="title">啦啦啦</span>
                        <span class="clicks">点击量:123</span>
                    </div>
                </a>
            </div>
            <div class="div-courses">
                <a href="javascript:void(0)">
                    <img src=./img/175726681578291143.jpg?6.6.2 alt="">
                    <div class="cont">
                        <span class="title">应用学密码</span>
                        <span class="clicks">点击量:660</span>
                    </div>
                </a>
            </div>
            <div class="div-courses">
                <a href="javascript:void(0)">
                    <img src="http://192.168.1.33/files/default/2015/06-12/172500cebfdf004785.jpg?6.6.2" alt="">
                    <div class="cont">
                        <span class="title">应用学密码</span>
                        <span class="clicks">点击量:660</span>
                    </div>
                </a>
            </div>
            <div class="div-courses">
                <a href="javascript:void(0)">
                    <img src="./img/17563975289c130676.jpg?6.6.2" alt="">
                    <div class="cont">
                        <span class="title">应用学密码</span>
                        <span class="clicks">点击量:660</span>
                    </div>
                </a>
            </div>
            <div class="div-courses">
                <a href="javascript:void(0)">
                    <img src="./img/1758295ce694730211.jpg?6.6.2" alt="">
                    <div class="cont">
                        <span class="title">应用学密码</span>
                        <span class="clicks">点击量:660</span>
                    </div>
                </a>
            </div>
        </div>

        <!--warp3-->
        <div class="warp warp3">
            <div class="div-courses">
                <a href="javascript:void(0)">
                    <img src="./img/kctp2.jpg" alt="">
                    <div class="cont">
                        <span class="title">这是第三页</span>
                        <span class="clicks">点击量:660</span>
                    </div>
                </a>
            </div>
            <div class="div-courses">
                <a href="javascript:void(0)">
                    <img src=./img/172635bdc41d559384.jpg?6.6.2 alt="">
                    <div class="cont">
                        <span class="title">啦啦啦</span>
                        <span class="clicks">点击量:123</span>
                    </div>
                </a>
            </div>
            <div class="div-courses">
                <a href="javascript:void(0)">
                    <img src=./img/175726681578291143.jpg?6.6.2 alt="">
                    <div class="cont">
                        <span class="title">应用学密码</span>
                        <span class="clicks">点击量:660</span>
                    </div>
                </a>
            </div>
            <div class="div-courses">
                <a href="javascript:void(0)">
                    <img src="./img/172500cebfdf004785.jpg?6.6.2" alt="">
                    <div class="cont">
                        <span class="title">应用学密码</span>
                        <span class="clicks">点击量:660</span>
                    </div>
                </a>
            </div>
            <div class="div-courses">
                <a href="javascript:void(0)">
                    <img src="./img/17563975289c130676.jpg?6.6.2" alt="">
                    <div class="cont">
                        <span class="title">应用学密码</span>
                        <span class="clicks">点击量:660</span>
                    </div>
                </a>
            </div>
            <div class="div-courses">
                <a href="javascript:void(0)">
                    <img src="./img/1758295ce694730211.jpg?6.6.2" alt="">
                    <div class="cont">
                        <span class="title">应用学密码</span>
                        <span class="clicks">点击量:660</span>
                    </div>
                </a>
            </div>
        </div>
    </section>


    <section class="video-rank">
        <span class="title">视频排行</span>
        <div class="videos-list">
            <li class="videos-list-li"><a href="javascript:void (0)"><span>1.</span>我的视频sadas</a></li>
            <li class="videos-list-li"><a href="javascript:void (0)"><span>2.</span>我的视频asdas</a></li>
            <li class="videos-list-li"><a href="javascript:void (0)"><span>3.</span>我的视频dfsd</a></li>
            <li class="videos-list-li"><a href="javascript:void (0)"><span>4.</span>我的视频dfgdf</a></li>
            <li class="videos-list-li"><a href="javascript:void (0)"><span>5.</span>我的视频asda</a></li>
            <li class="videos-list-li"><a href="javascript:void (0)"><span>6.</span>我的视频asda</a></li>
            <li class="videos-list-li"><a href="javascript:void (0)"><span>7.</span>我的视频fdsfs</a></li>
            <li class="videos-list-li"><a href="javascript:void (0)"><span>8.</span>我的视频</a></li>
            <li class="videos-list-li"><a href="javascript:void (0)"><span>10.</span>我的视频</a></li>
        </div>
    </section>
</section>
</div>
<section class="introduction-section">
    <div class="xxaq">
        <div>
            <img alt="" src="img/信息安~1.PNG">
        </div>
        <div class="aq">
            <a href="http://www.baidu.com44">信息安全</a>
        </div>
    </div>
    <div class="xxaq">
        <div>
            <img alt="" src="img/实训平~1.PNG">
        </div>
        <div class="aq">
            <a href="javascript:void(0)">实训平台</a>
        </div>
    </div>
    <div class="xxaq">
        <div>
            <img alt="" src="img/资质认~1.PNG">
        </div>
        <div class="aq"><a href="javascript:void(0)">资质认证</a></div>
    </div>
</section>
<section class="teacher-section">
    <h1><span>名师推荐</span></h1>
    <div class="items-teacher-div">
        <img src="./img/09245240ec3e065465.jpg?6.6.2" class="teacher-avatar">
        <span class="teacher-name">Phill</span>
        <span class="teacher-tag">这是一个很牛X的老师</span>
        <p class="teacher-intro">
            主要负责好知网的运营工作。 英国卡迪夫大学新闻学硕士，原浙江...
        </p>
    </div>
    <div class="items-teacher-div">
        <img src="./img/161605514826925213.JPG?6.6.2" class="teacher-avatar">
        <span class="teacher-name">jason</span>
        <span class="teacher-tag">这是一个很牛X的老师</span>
        <p class="teacher-intro">

            负责好知网和EduSoho的产品设计和规划。曾经就职于恒生电...

        </p>
    </div>
    <div class="items-teacher-div">
        <img src="http://192.168.1.33/files/default/2015/05-22/155036c81c6c142598.jpg?6.6.2" class="teacher-avatar">
        <span class="teacher-name">tony</span>
        <span class="teacher-tag">这是一个很牛X的老师</span>
        <p class="teacher-intro">
            拥有超过10年在外企进行软件开发、项目管理的经验， 带领团队...
        </p>
    </div>
    <div class="items-teacher-div">
        <img src="http://192.168.1.33/files/default/2015/05-22/154902e67253351649.jpg?6.6.2" class="teacher-avatar">
        <span class="teacher-name">kent</span>
        <span class="teacher-tag">这是一个很牛X的老师</span>
        <p class="teacher-intro">
            负责好知网和EduSoho的产品设计和规划。曾担任全球500...
        </p>
    </div>
</section>
<footer>
    <div class="foot_auto">
        <span class="yue">粤ICP备0587050</span>
    </div>
    <div class="fo2">
        <span class="yue">广州市水晶球信息技术有限公司 提供技术支持</span>
    </div>
    <span>地址：广州市天河区黄埔大道中336号御发商务中心5-6层 电话：020-38468375</span>
    <div class="fo1">
        <span>© 2014 All Rights Reserved 蓝盾学院版权所有</span>
    </div>
</footer>
</body>
<script src="js/jquery.js"></script>
<script src="js/idangerous.swiper.min.js"></script>

<script>
    (function () {
        new Swiper('.swiper-container', {
            loop: true,
            pagination: '.pagination',
            autoplay: '3000',
            mode: 'horizontal'
        });
        /*初始化显示*/
        var warp_show = $(".warp_show").attr("data-key");
        $("." + warp_show).show();
    })($);
    /*tab显示*/
    $(".course-tab").on("click", function () {
        $(".course-tab").removeClass("warp_show");
        $(this).addClass("warp_show");
        var tag_name = $(this).attr("data-key");
        $(".warp").hide();
        $("." + tag_name).show();
    })
</script>

</html>